<template>
	<view class="paidDetail">
		<nav-bars backState="1000" :bgColor="navBackground" fontColor="#fff" title="订单详情"></nav-bars>
		<view class="topImg">
			<image :src="`${baseImg}/static/adminShop/detailBack.png`" mode=""></image>
			<!-- time -->
			<view class="time">
				<view class="title">
					<image :src="`${baseImg}/static/adminShop/detailWait.png`" mode=""></image>
					{{status[orderdetail.order_status]}}
				</view>
				<view class="onlyTime" v-if="order_time===true && orderdetail.order_status==1">
					订单已关闭
				</view>
				<view class="onlyTime" v-if="orderdetail.order_status == 1 && order_time===false">还剩
					<countdown :startTime="startTime" :endTime="enTime" style="display: inline-block;" />自动关闭订单
				</view>
			</view>
			<!-- 用户信息 -->
			<view class="userInfo" v-if="orderdetail.name">
				<view class="infoItem">
					<view class="left">
						<image :src="`${baseImg}/static/adminShop/detailAddress.png`" mode=""></image>
						<view class="call">
							<view class="info">
								{{orderdetail.name}} {{orderdetail.mobile}}
							</view>
							<view class="address">
								{{orderdetail.province}}{{orderdetail.city}}{{orderdetail.area}}{{orderdetail.address}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="content" :style="'margin-top:'+navHeight+'rpx;'">
			<!-- 商品清单 -->
			<view class="shopList">
				<h3 v-if="orderdetail.store_name">{{orderdetail.store_name}}<i class="iconfont icon-more"></i></h3>
				<view class="list" v-for="(items,index) in orderdetail.list" :key="index">
					<view class="item"
						@click="goSkip('/pages_mall/pages/mall/goods_details/goods_details?id='+items.product_id)">
						<image :src="items.main_imgurl" mode=""></image>
						<view class="shopInfo">
							<view class="top">
								<view class="tit omit-2">
									{{items.product_title}}
								</view>
								¥ {{items.price}}
							</view>
							<view class="spec">
								<view v-for="(attr_params,index) in items.attr_params" style="display: inline-block;">
									<text v-if="attr_params.attr_name">{{attr_params.attr_value}}</text>
									<text v-if="attr_params.key">{{attr_params.value}}</text>
								</view>
								<text style="float: right;">x{{items.num}}</text>
							</view>
						</view>
					</view>
				</view>
				<!-- 价钱 -->
				<view class="price">
					<view class="all">
						总价<span>¥ {{orderdetail.price}}</span>
					</view>
					<view class="all">
						运费<span>¥ 0.00</span>
					</view>
					<view class="need" v-if="orderdetail.is_many_way == 1 && orderdetail.deposit_status == 0">
						待付定金<span>¥ {{orderdetail.deposit_price}}</span>
					</view>
					<view class="need" v-if="orderdetail.is_many_way == 1 &&orderdetail.balance_status == 0">
						待付尾款<span>¥ {{orderdetail.balance_price}}</span>
					</view>
				</view>
			</view>

			<!-- 订单信息 -->
			<view class="orderInfo">
				<h3>订单信息</h3>
				<view class="top">
					<view class="item">
						订单编号<view class="txt">{{orderdetail.order_code}}<span
								@click="copy(orderdetail.order_code)">复制</span></view>
					</view>
					<view class="item">
						支付状态<view class="txt">{{status[orderdetail.order_status]}}</view>
					</view>
					<view class="item" v-if="orderdetail.buy_type==2 && orderdetail.order_status!=1">
						拼团状态<view class="txt">{{groupStatus[orderdetail.pintuan_status]}}</view>
					</view>
					<view class="item">
						配送方式<view class="txt" v-if="orderdetail.move_way == 1">快递</view>
						<view class="txt" v-else>自提</view>
					</view>
				</view>
				<view class="bottom">
					下单时间<span>{{orderdetail.create_time | formatDates}}</span>
				</view>
			</view>
		</view>
		<!-- 按钮 -->
		<view class="btn" v-if="orderdetail.order_status == 1">
			<!-- #ifndef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()">联系商家</view>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()" v-if="!config_id && !config_url">联系商家</view>
			<view class="btn_item" v-else @click="gitpouchatshow">联系商家</view>
			<!-- #endif -->
			<view class="btn_item" @click="cancelOrder(orderdetail.order_code)">取消订单</view>
			<view class="btn_item" @click="payModel(orderdetail,orderdetail.order_code)" v-if="orderdetail.order_status!=5">立即付款</view>
		</view>
		<view class="btn" v-if="orderdetail.order_status == 2">
			<!-- #ifndef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()">联系商家</view>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()" v-if="!config_id && !config_url">联系商家</view>
			<view class="btn_item" v-else @click="gitpouchatshow">联系商家</view>
			<!-- #endif -->
			<view class="btn_item" @click="goAfterSale(orderdetail.order_code,orderdetail.order_status)" v-if="orderdetail.buy_type!=2">申请售后</view>
			<view class="btn_item" v-if="orderdetail.is_many_way == 1 &&item.balance_status == 0"
				@click="payModel(orderdetail,orderdetail.order_code)">付尾款</view>
		</view>
		<view class="btn" v-if="orderdetail.order_status == 3">
			<!-- #ifndef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()">联系商家</view>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()" v-if="!config_id && !config_url">联系商家</view>
			<view class="btn_item" v-else @click="gitpouchatshow">联系商家</view>
			<!-- #endif -->
			<view class="btn_item" @click="goAfterSale(orderdetail.order_code,orderdetail.order_status)">申请售后</view>
			<view class="btn_item" v-if="orderdetail.arrive_status == 0"
				@click="confirms(orderdetail,orderdetail.order_code)">确认收货</view>
			<view class="btn_item" v-if="orderdetail.is_many_way == 1 &&item.balance_status == 0"
				@click="payModel(orderdetail,orderdetail.order_code)">付尾款</view>
		</view>
		<view class="btn" v-if="orderdetail.order_status == 4">
			<!-- #ifndef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()">联系商家</view>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()" v-if="!config_id && !config_url">联系商家</view>
			<view class="btn_item" v-else @click="gitpouchatshow">联系商家</view>
			<!-- #endif -->
			<view class="btn_item" @click="deleteOrder(orderdetail.order_code)">删除订单</view>
		</view>
		<view class="btn" v-if="orderdetail.order_status == 5">
			<!-- #ifndef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()">联系商家</view>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<view class="btn_item" @click="gitchat()" v-if="!config_id && !config_url">联系商家</view>
			<view class="btn_item" v-else @click="gitpouchatshow">联系商家</view>
			<!-- #endif -->
			<view class="btn_item" @click="deleteOrder(orderdetail.order_code)">删除订单</view>
		</view>

		<!-- 二维码 -->
		<view class="qrcodepop" :style="showModal?'':'display:none;'">
			<view class="qrcodecont">
				<view class="qrname">
					<view>核销二维码</view>
					<view><canvas canvas-id="myQrcode"></canvas></view>
				</view>
				<view class="iconfont icon-close" @click="handleHideCodeClick"></view>
			</view>
		</view>

		<!-- 微信客服 -->
		<view class="pouchat" v-if="pouchatshow">
			<view class="poucont">
				<view class="chatlist">
					<view class="chatml" @click="gitwxchat()" v-if="config_url">
						<image src="https://manager.ryz1620.com/static/my/wxchat.png" mode="widthFix"></image>
						<text class="t1">在线微信客服</text>
						<text class="t2">可直接联系客服</text>
					</view>
					<view class="chatml" v-if="config_id">
						<cell class="cell-service" bind:startmessage='startmessage'
							bind:completemessage="completemessage" :plugid="config_id" />
						<image src="https://manager.ryz1620.com/static/my/codechat.png" mode="widthFix"></image>
						<text class="t1">添加微信客服</text>
						<text class="t2">扫微信二维码</text>
					</view>
				</view>
				<view class="iconfont icon-close" @click="wxCodeClick"></view>
			</view>
		</view>
	</view>
</template>

<script>
	var t;
	import countdown from "@/components/cz-countdown/cz-countdown.vue"
	import service_mall from '@/service/mall.js'
	const qrCode = require('@/utils/weapp-qrcode.js')
	export default {
		components: {
			countdown,
			// #ifdef MP-WEIXIN
			"cell": "plugin://contactPlugin/cell",
			// #endif
		},
		data() {
			return {
				navBackground: '',
				baseImg: 'http://manager.ryz1620.com',
				navHeight: 200,
				startTime: '',
				enTime: '',
				status: {
					1: "待付定金",
					2: "待发货",
					3: "待收货",
					4: "已完成",
					5: "已关闭"
				},
				orderdetail: '',
				tapIndex: '',
				code: '',
				showModal: false,
				terminal: "",
				config_id: '',
				config_url: '',
				pouchatshow: false,
				order_time: false,
				groupStatus:{
					1:"拼团中",
					2:"拼团成功",
					3:"拼团失败",
				},
			}
		},
		filters: {
			formatDates(value) {
				let date = new Date(parseInt(value) * 1000);
				let y = date.getFullYear();
				let m = date.getMonth() + 1;
				m = m < 10 ? "0" + m : m;
				let d = date.getDate();
				d = d < 10 ? "0" + d : d;
				let h = date.getHours();
				h = h < 10 ? "0" + h : h;
				let minute = date.getMinutes();
				let second = date.getSeconds();
				minute = minute < 10 ? "0" + minute : minute;
				second = second < 10 ? "0" + second : second;
				return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
			},
			formatDate(value) {
				var date = new Date(value);
				//date.setTime(value);
				var month = date.getMonth() + 1;
				var hours = date.getHours();
				if (hours < 10)
					hours = "0" + hours;
				var minutes = date.getMinutes();
				if (minutes < 10)
					minutes = "0" + minutes;
				var time = date.getFullYear() + "/" + month + "/" + date.getDate() +
					" " + hours + ":" + minutes;
				return time;
			}
		},
		onLoad(options) {
			this.$utils.getUrl()
			this.navHeight = 468 - (Number(this.$store.state.system.navBarHeight) * 2)
			this.order_code = options.orderid
			this.getdata();
			//#ifdef MP-WEIXIN
			this.terminal = "wxapplet";
			//#endif
		},
		methods: {
			copy(value) {
				uni.setClipboardData({
					data: value, //要被复制的内容
					success: () => { //复制成功的回调函数
						console.log('复制成功')
					}
				});
			},
			// 订单详情
			getdata() {
				uni.showLoading()
				service_mall.getdata({
						order_code: this.order_code
					})
					.then(res => {
						uni.hideLoading()
						if (res.code == 1) {
							let current = Math.round(new Date() / 1000);
							let close_time = res.data.close_time;
							let endata = res.data.create_time + close_time * 60
							this.startTime = this.$options.filters.formatDates(current)
							this.enTime = this.$options.filters.formatDates(endata)
							this.orderdetail = res.data
							this.gitConfig()
							this.gitwxConfig()
							this.startTimeouts(current,endata);
						}
					})
					.catch(err => {
						uni.hideLoading()
					})
			},
			startTimeouts(current,endata) {
				var _this=this;
				t = setTimeout(function() {
					if(endata-current<=0){
						_this.order_time=true;
						_this.stopTimeouts()
					}else{
						_this.startTimeouts(Math.round(new Date() / 1000),endata)
					}
				}, 1000);
			},
			stopTimeouts() {
				clearTimeout(t)
			},
			// 获取企业微信callme配置
			gitConfig() {
				service_mall.getCallMeConfig({
					partner_type: 'shop',
					partner_id: this.orderdetail.store_id
				}).then(res => {
					if (res.code == 1) {
						this.config_id = res.data.config_id;
					}
				});
			},
			gitwxConfig() {
				service_mall.getwxMeConfig({
					partner_type: 'shop',
					partner_id: this.orderdetail.store_id
				}).then(res => {
					if (res.code == 1) {
						this.config_url = res.data.url;
					}
				});
			},
			gitpouchatshow() {
				this.pouchatshow = true
			},
			wxCodeClick() {
				this.pouchatshow = false
			},
			gitwxchat() {
				wx.openCustomerServiceChat({
					extInfo: {
						url: this.config_url
					},
					corpId: this.$env.CORPID,
					success(res) {}
				})
			},
			gitchat() {
				uni.showToast({
					title: '哎呀!不好意思，暂未配置客服...',
					icon: 'none',
					duration: 2000
				});
				// uni.navigateTo({
				// 	url:'/pages_customer/pages/index?partner_type=shop&partner_id=' + this.orderdetail.store_id
				// })	
			},
			// 确认收货
			confirms(item, id) {
				uni.navigateTo({
					url: "/pages_mall/pages/mall/order/confirmorder?orderid=" + id
				})
			},
			// 选择支付方式
			payModel(item, id) {
				let itemList = ["微信支付", "线下支付"]
				this.itemList = itemList
				uni.showActionSheet({
					itemList: this.itemList,
					success: (t) => {
						this.tapIndex = t.tapIndex + 1
						this.getpayorder(item.order_code)
					}
				});
			},
			initQrCode: function() {
				new qrCode('myQrcode', {
					text: this.code,
					width: 160,
					height: 160,
					colorDark: "#333333",
					colorLight: "#FFFFFF",
					correctLevel: qrCode.CorrectLevel.H
				})
			},
			handleShowCodeClick: function() {
				this.showModal = true
				this.$nextTick(function() {
					this.initQrCode()
				})
			},
			handleHideCodeClick: function() {
				this.showModal = false
			},
			getpayorder(order_codes) {
				service_mall.getpay({
					order_no: order_codes,
					type: 'product_order',
					pay_type: this.tapIndex
				}).then(res => {
					if (res.code == 1) {
						let data = res.data
						if (this.tapIndex == 1) {
							if (this.terminal == 'wxapplet') {
								uni.requestPayment({
									appId: res.data.appId,
									nonceStr: res.data.nonceStr,
									package: res.data.package,
									paySign: res.data.paySign,
									signType: res.data.signType,
									timeStamp: res.data.timeStamp,
									success: (suc) => {
										uni.navigateTo({
											url: "/pages_mall/pages/mall/order/sucess?type=1" +
												'&order_no=' + order_codes
										})
									},
									fail: (err) => {
										uni.navigateTo({
											url: "/pages_mall/pages/mall/order/sucess?type=0" +
												'&order_no=' + order_codes
										})
									}
								});
							} else {
								uni.requestPayment({
									provider: 'wxpay',
									orderInfo: {
										"appid": res.data.appid,
										"partnerid": res.data.partnerid,
										"prepayid": res.data.prepayid,
										"noncestr": res.data.noncestr,
										"package": res.data.package,
										"timestamp": res.data.timestamp,
										"sign": res.data.sign,
									},
									success: (suc) => {
										uni.navigateTo({
											url: "/pages_mall/pages/mall/order/sucess?type=1" +
												'&order_no=' + order_codes
										})
									},
									fail: (err) => {
										uni.navigateTo({
											url: "/pages_mall/pages/mall/order/sucess?type=0" +
												'&order_no=' + order_codes
										})
									}
								});
							}
						} else {
							this.code = res.data.verificationCode
							this.handleShowCodeClick()
						}

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000
						});
					}
				})
			},
			// 删除订单
			deleteOrder(id) {
				let that = this
				uni.showModal({
					title: "提示！",
					content: "是否删除该订单",
					success: function(i) {
						if (i.confirm) {
							uni.showLoading('正在删除...')
							service_mall.getdelProductOrder({
								order_code: id,
							}).then(res => {
								uni.hideLoading();
								if (res.code == 1) {
									uni.navigateTo({
										url: '/pages_mine/pages/mall/order/list',
									});
								} else {
									uni.showToast({
										title: "删除失败！",
										icon: "none"
									});
								}
							});
						}
					}
				});
			},
			// 取消订单
			cancelOrder(id) {
				let that = this
				uni.showModal({
					title: "提示！",
					content: "是否取消该订单",
					success: function(i) {
						if (i.confirm) {
							uni.showLoading('正在取消...')
							service_mall.getupOrdercancel({
								order_code: id,
							}).then(res => {
								uni.hideLoading();
								if (res.code == 1) {
									that.list = []
									that.page = 1
									that.getdata();
								} else {
									uni.showToast({
										title: "取消失败！",
										icon: "none"
									});
								}
							});
						}
					}
				});
			},
			//申请售后选择服务
			goAfterSale(order_code, status) {
				this.$common.navigateTo('/pages_mall/pages/mall/after_sale/refundType?orderid=' + order_code + '&status=' +
					status);
			},
			goSkip(url) {
				this.$common.navigateTo(url);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.icon-more {
		display: inline-block;
	}

	.paidDetail {
		width: 100%;

		.topImg {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 468rpx;

			image {
				width: 100%;
				height: 100%;
			}

			.time {
				padding: 0 44rpx;
				position: absolute;
				bottom: 146rpx;
				left: 0;
				color: #fff;

				.title {
					display: flex;
					align-items: center;
					margin-bottom: 8rpx;

					image {
						margin-right: 16rpx;
						width: 40rpx;
						height: 40rpx;
						border-radius: 50%;
					}

					font: 500 36rpx/36rpx PingFang SC;
				}

				.onlyTime {
					font: 400 26rpx/36rpx PingFang SC;
					margin-top: 25rpx;
				}
			}

			// 用户信息
			.userInfo {
				width: 100%;
				position: absolute;
				left: 0;
				bottom: -102rpx;

				.infoItem {
					padding: 28rpx 24rpx;
					display: flex;
					justify-content: space-between;
					margin: 0 auto;
					width: 702rpx;
					height: 188rpx;
					background-color: #fff;
					border-radius: 16rpx;

					image {
						width: 40rpx;
						height: 40rpx;
					}

					.left {
						display: flex;

						.call {
							margin: 0 20rpx 0 24rpx;
							display: flex;
							flex-direction: column;

							.info {
								margin-bottom: 20rpx;
								display: flex;
								color: #0A0605;
								font: 500 26rpx/40rpx PingFang SC;

								span {
									margin-left: 16rpx;
									padding: 0rpx 12rpx;
									border-radius: 18rpx;
									background-color: #F5F6F6;
									font: 400 18rpx/40rpx PingFang SC;
								}
							}

							.address {
								color: #505050;
								font: 400 26rpx/40rpx PingFang SC;
							}
						}
					}
				}
			}
		}

		// 内容
		.content {
			padding: 126rpx 24rpx 0;
			margin-bottom: 116rpx;
			padding-bottom: 120rpx;

			// 商品清单
			.shopList {
				background-color: #fff;
				padding: 28rpx;
				border-radius: 16rpx;

				h3 {
					padding-bottom: 28rpx;
					font: 500 30rpx/40rpx PingFang SC;
					color: #0A0605;
				}

				.list {
					.item {
						display: flex;
						margin-bottom: 32rpx;

						image {
							width: 148rpx;
							height: 148rpx;
							border-radius: 8RPX;
						}

						.shopInfo {
							width: 478rpx;
							margin-left: 24rpx;
							display: flex;
							flex-direction: column;

							.top {
								color: #505050;
								font: 400 26rpx/40rpx PingFang SC;

								.tit {
									width: 328rpx;
								}

								display: flex;
								justify-content: space-between;
							}

							.spec {
								margin-top: 40rpx;
								color: #A0A0A0;
								font: 400 22rpx/22rpx PingFang SC;
							}
						}
					}
				}

				// 价钱
				.price {
					padding-top: 32rpx;
					border-top: 2rpx solid #F5F5F5;

					view {
						display: flex;
						justify-content: space-between;
					}

					.all {
						padding: 10rpx 0;
						font: 400 26rpx/40rpx PingFang SC;
						color: #505050;
					}

					.need {
						padding: 10rpx 0;
						font: 500 26rpx/40rpx PingFang SC;
						color: #0A0605;

						span {
							color: #DBA954;
						}
					}
				}
			}

			// 订单信息
			.orderInfo {
				margin-top: 24rpx;
				background-color: #fff;
				padding: 28rpx;
				border-radius: 16rpx;

				h3 {
					font: 500 30rpx/40rpx PingFang SC;
					color: #0A0605;
				}

				.top {
					padding: 28rpx 0 0;
					margin-bottom: 24rpx;
					border-bottom: 2rpx solid #f5f5f5;

					.item {
						font: 400 26rpx/40rpx PingFang SC;
						color: #A0A0A0;
						display: flex;
						margin-bottom: 24rpx;
						align-items: center;

						.txt {
							display: flex;
							color: #505050;
							margin-left: 32rpx;

							span {
								margin-left: 18rpx;
								padding: 0 14rpx;
								border-radius: 18rpx;
								color: #DBA954;
								font: 400 18rpx/40rpx PingFang SC;
								background-color: rgba(219, 169, 84, 0.1);
							}
						}
					}
				}

				.bottom {
					font: 400 26rpx/40rpx PingFang SC;
					color: #A0A0A0;
					display: flex;
					align-items: center;

					span {
						margin-left: 32rpx;
						color: #505050;
					}
				}
			}
		}

		// 按钮
		.btn {
			width: 100%;
			height: 92rpx;
			background-color: #fff;
			position: fixed;
			bottom: 0;
			left: 0;
			display: flex;
			justify-content: flex-end;
			padding: 0 24rpx;
			height: calc(92rpx+ constant(safe-area-inset-bottom));
			height: calc(92rpx + env(safe-area-inset-bottom));
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);

			.btn_item {
				width: 154rpx;
				height: 56rpx;
				border-radius: 28rpx;
				border: 2rpx solid #505050;
				font: 400 24rpx/56rpx PingFang SC;
				color: #505050;
				text-align: center;
				margin: 18rpx 0 18rpx 20rpx;
				position: relative;

				.cell-service {
					position: absolute;
					right: 0;
					bottom: 0;
					left: 0;
					top: 0;
					opacity: 0;
					z-index: 10;

					.cell--bubble {
						width: 100%;
					}
				}
			}
		}
	}

	.qrcodepop {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.2);
		z-index: 9999;

		.qrcodecont {
			width: 400rpx;
			position: absolute;
			left: 50%;
			top: 25%;
			margin-left: -200rpx;

			.qrname {
				background: #fff;
				line-height: 80rpx;
				height: 440rpx;
				overflow: hidden;
				padding: 20rpx;
				text-align: center;
				border-radius: 15rpx;

				canvas {
					width: 300rpx;
					height: 300rpx;
					margin: auto;
				}
			}

			.icon-close {
				display: block;
				font-size: 60rpx;
				color: #fff;
				text-align: center;
				margin: 30rpx auto;
			}
		}
	}

	// 客服弹框
	.pouchat {
		position: fixed;
		background: rgba(0, 0, 0, 0.5);
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 9999;

		.poucont {
			position: absolute;
			top: 30%;
			left: 15%;
			right: 15%;

			.icon-close {
				width: 80rpx;
				height: 80rpx;
				font-size: 70rpx;
				color: #fff;
				line-height: 80rpx;
				text-align: center;
				margin: 30rpx auto;
			}
		}

		.chatlist {
			background: #fff;
			padding: 30rpx;
			border-radius: 10rpx;
		}

		.chatml {
			position: relative;
			padding: 20rpx;
			padding-left: 100rpx;
			min-height: 100rpx;

			.cell-service {
				position: absolute;
				right: 0;
				bottom: 0;
				left: 0;
				top: 0;
				opacity: 0;
				z-index: 10;

				.cell--bubble {
					width: 100%;
				}
			}

			text {
				display: block;
				line-height: 40rpx;
			}

			.t1 {
				font-size: 32rpx;
			}

			.t2 {
				font-size: 24rpx;
				color: #999;
			}

			image {
				width: 70rpx;
				height: 70rpx;
				position: absolute;
				left: 15rpx;
				top: 25rpx;
			}
		}
	}
</style>
